<!-- todo only a stub, add other controls later -->

<span #nameBox class="name"
      [class.dragging]="isDragging"
      [class.dragging-over]='isDraggingOver'
      draggable="true"
      (dragstart)="ondragstart($event, nameBox)"
      (dragend)="ondragend()"
      (dragover)="ondragover($event)"
      (dragenter)="ondragenter()"
      (dragleave)="ondragleave()"
      (drop)="ondrop($event, nameBox)"
      (click)="onclick()">
  {{name}}
</span>